<template >
	<div class="content">
		<div class="content-header">班级成绩管理</div>
		<div class="content-table">
			<el-form inline size="mini">
				<el-form-item >
					<el-input  placeholder="班级名称" v-model="form.name"></el-input>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" icon="el-icon-search" @click="getList">查 询</el-button>
					<el-button icon="el-icon-refresh" @click="resetList">重 置</el-button>
				</el-form-item>
			</el-form>
			<el-table
					:data="tableData"
					stripe
					style="width: 100%">
				<el-table-column
						prop="number"
						label="自增编号"
						align="center"
				>
				</el-table-column>
				<el-table-column
						prop="name"
						label="班级名称"
						align="center"
				>
				</el-table-column>
				<el-table-column
						prop="majorName"
						label="对应专业"
						align="center"
				>
				</el-table-column>
				<el-table-column
						prop="userName"
						label="授课老师"
						align="center"
				>
				</el-table-column>
				<el-table-column
						prop="startTime"
						label="授课时间"
						show-overflow-tooltip
						align="center"
				>
				</el-table-column>
				<el-table-column
						label="操作"
						align="center"
				>
					<template slot-scope="scope">
						<el-button type="primary" size="mini" @click="uploadResult(scope.row)">导出成绩单</el-button>
						<el-button type="primary" size="mini" @click="getInDetails(scope.row)">查 看</el-button>
						<el-button type="danger" size="mini" @click="del(scope.row.id)">删 除</el-button>
					</template>
				</el-table-column>
			</el-table>
		</div>
		<div class="content-footer">
			<el-pagination
					@size-change="handleSizeChange"
					@current-change="handleCurrentChange"
					background
					:page-size="10"
					small
					layout="total, prev, pager, next, jumper"
					:total="total">
			</el-pagination>
		</div>
	</div>
</template >

<script >
    import {classList,delClass,exportClass} from "../api/class";
    import request from "../utils/request";
    import common from "../utils/common";
    export default {
        data(){
            return{
                specialityList:[],
                teacherList:[],
                form:{
                    name: "",
                    pageIndex: 1,
                    pageSize: 10
                },
                value:'',
                tableData:[],
                total:null,
            }
        },
        mounted() {
            this.getList()
        },
        methods: {
            //查询列表
            async getList(){
                const { data } = await classList(this.form)
                if (data.code === 200){
                    this.tableData = data.data.data
                    this.total = data.data.total
                }
            },
            //重置
            resetList(){
                this.form.name = ''
                this.getList()
            },
			//查看详情
            getInDetails(item){
                window.sessionStorage.setItem('pageForm',JSON.stringify(item))
				this.$router.push('/classResults')
			},
			//导出成绩单
            uploadResult(item){
                this.$confirm('导出该班级成绩, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.downloadFile(item)
                })
			},
            //下载班级成绩
            downloadFile(item) {
                request({
                    url: common.requestUrl + "/class/exportClassScore?classId=" + item.id,
                    method: 'get',
                    responseType: 'blob',
                }).then(resp => {
                    console.log('ppp', resp)
                    const blob = new Blob([resp.data], {type: "application/vnd.ms-excel"});
                    const url = window.URL.createObjectURL(blob);
                    let a = document.createElement('a');
                    a.download = item.name + '成绩.xls';
                    a.href = url;
                    a.click();
                })  //导出文件请求
            },
            //删除
            del(id){
                this.$confirm('删除该班级, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    delClass(id).then(res => {
                        if (res.data.code === 200){
                            this.$notify.success(res.data.message)
                            this.getList()
                        }
                    })
                })
            },
            //分页
            handleSizeChange(val) {
                this.form.pageSize = val
                this.getList()
            },
            handleCurrentChange(val) {
                this.form.pageIndex = val
                this.getList()
            }
        },
    }
</script >

<style scoped lang="less" >
	@import "../assets/style/common";
</style >
